<ion-header>
  <ion-toolbar color="primary">
  <ion-navbar>
    <ion-title>
      装货-容器扫描
    </ion-title>
  </ion-navbar>
  </ion-toolbar>
</ion-header>

<ion-content>
  <ion-card>
    <ion-card-content>
      <ion-card-title>
        请扫描容器二维码
      </ion-card-title>
      <!--<ion-row>
        <input value="" id="scaninfo" col-12 type="text" placeholder="请将光标移至此处或点击开始扫描按钮" [(ngModel)]="qrcode"
               (ngModelChange)="infoChange($event)"
               onclick="javascript:document.querySelector('#scaninfo').value=''">
      </ion-row>-->
      <ion-row>
       <!-- <button col-12 ion-button full (click)="scanBtn()" id="containerBtn"
                onclick="javascript:document.querySelector('#scaninfo').value=''">开始扫描
        </button>-->

        <!--APP-->
        <button col-12 ion-button full (click)="toScan()" ><ion-icon name="barcode"></ion-icon>&nbsp;开始扫描</button>

        <!--<button col-4 ion-button icon-right  outline  full (click)="choseContainer($event)"  id="choseContainerbtn">选择容器
          <ion-icon  name="arrow-dropdown"></ion-icon>
        </button>-->
      </ion-row>
    </ion-card-content>
  </ion-card>

  <ion-card class="hides" hidden>
    <ion-card-content>
      <ion-card-title>
        容器基本信息
      </ion-card-title>
      <ion-row>
        <ion-col col-2 text-left>
          <h5>编码:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerCode}}</h5>
        </ion-col>
        <ion-col col-1><h4>丨</h4></ion-col>
        <ion-col col-2 text-left>
          <h5>名称:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerName}}</h5>
        </ion-col>
      </ion-row>

      <ion-row>
        <ion-col col-2 text-left>
          <h5>自重:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerDeadWeight}}kg</h5>
        </ion-col>
        <ion-col col-1><h4>丨</h4></ion-col>
        <ion-col col-2 text-left>
          <h5>承重:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerBearWeight}}kg</h5>
        </ion-col>
      </ion-row>

      <ion-row>
        <ion-col col-2 text-left>
          <h5>长:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerLength}}cm</h5>
        </ion-col>
        <ion-col col-1><h4>丨</h4></ion-col>
        <ion-col col-2 text-left>
          <h5>宽:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerWidth}}cm</h5>
        </ion-col>
      </ion-row>
      <ion-row>
        <ion-col col-2 text-left>
          <h5>高:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{container.containerHeight}}cm</h5>
        </ion-col>
        <ion-col col-1><h4>丨</h4></ion-col>
        <ion-col col-2 text-left>
          <h5>体积:</h5>
        </ion-col>
        <ion-col col-3.5 text-right>
          <h5>{{(container.containerHeight*container.containerWidth*container.containerLength)/1000000 | number : '1.0-3'}}m³</h5>
        </ion-col>
      </ion-row>

      <ion-row>
        <ion-col col-2.75 text-left>
          <h5>容器类型:</h5>
        </ion-col>
        <ion-col col-2.75 text-right>
          <h5>{{container.containerType}}</h5>
        </ion-col>
        <ion-col col-1><h4>丨</h4></ion-col>
        <ion-col col-2.75 text-left>
          <h5>容器许可:</h5>
        </ion-col>
        <ion-col col-2.75 text-right>
          <h5>{{container.containerPermission}}</h5>
        </ion-col>
      </ion-row>
      <ion-row>
        <ion-col col-2.5 text-left>
          <h5>备注:</h5>
        </ion-col>
        <ion-col col-9.5 text-right>
          <h5>{{container.containerComment}}</h5>
        </ion-col>
      </ion-row>

    </ion-card-content>
  </ion-card>
</ion-content>


<ion-footer>
  <ion-row>
    <ion-col col-6>
      <button ion-button full [disabled]="enableScanMateriel" (click)="scanMateriel()" id="scanMaterielBtn">扫描货物</button>
    </ion-col>

    <!--<ion-col col-4>
      <button ion-button full [disabled]="enableRule" disabled (click)="ruleContainer()" id="ruleContainerBtn">容器打尺</button>
    </ion-col>-->

    <ion-col col-6>
      <button ion-button full color="light" (click)="goBack()">取消</button>
    </ion-col>
  </ion-row>
</ion-footer>




